<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Tiny tools</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <!-- Loading Bootstrap -->
        <link href="css/bootstrap.min.css" rel="stylesheet">

        <!-- Loading Flat UI -->
        <link href="css/flat-ui.min.css" rel="stylesheet">
        <link href="css/common.css" rel="stylesheet">

        <link rel="shortcut icon" href="img/favicon.ico">

        <!-- HTML5 shim, for IE6-8 support of HTML5 elements. All other JS at the end of file. -->
        <!--[if lt IE 9]>
          <script src="js/html5shiv.js"></script>
          <script src="js/respond.min.js"></script>
        <![endif]-->
    </head>
    <body>
        <div class="container">
            <div id="header">
                <h6>Tiny tools</h6>
            </div>
            <form action="">
                <input type="hidden" name="url" id="url"/>
                <div class="form-group">

                    <label class="radio radio-inline">
                        <input type="radio" name="type" value="qrcode" data-select="auto|qrencode|qrdecode" data-toggle="radio" checked="checked" class="custom-radio"><span class="icons"><span class="icon-unchecked"></span><span class="icon-checked"></span></span>
                        二维码
                    </label>

                    <label class="radio radio-inline">
                        <input type="radio" name="type" value="timestamp" data-select="auto" data-toggle="radio" class="custom-radio"><span class="icons"><span class="icon-unchecked"></span><span class="icon-checked"></span></span>
                        时间戳
                    </label>

                    <label class="radio radio-inline">
                        <input type="radio" name="type" value="translate" data-select="auto|auto-zh|zh-en|en-zh" data-toggle="radio" class="custom-radio"><span class="icons"><span class="icon-unchecked"></span><span class="icon-checked"></span></span>
                        翻译
                    </label>

                    <label class="radio radio-inline">
                        <input type="radio" name="type" value="format" data-select="auto|json|javascript|html|xml|css|sql" data-toggle="radio" class="custom-radio"><span class="icons"><span class="icon-unchecked"></span><span class="icon-checked"></span></span>
                        格式化
                    </label>

                    <label class="radio radio-inline">
                        <input type="radio" name="type" value="url" data-select="auto|urlencode|urldecode|uniencode|unidecode" data-toggle="radio" class="custom-radio"><span class="icons"><span class="icon-unchecked"></span><span class="icon-checked"></span></span>
                        URL编码
                    </label>

                    <label class="radio radio-inline">
                        <input type="radio" name="type" value="base64" data-select="auto|base64encode|base64decode" data-toggle="radio" class="custom-radio"><span class="icons"><span class="icon-unchecked"></span><span class="icon-checked"></span></span>
                        Base64编码
                    </label>
                    <textarea name="input" id="inputtext" class="form-control" cols="30" rows="5" placeholder="输入"></textarea>
                    <div class="row" style="margin:20px -15px;">
                        <div class="col-xs-3">
                            <a href="javascript:;" id="exchange" class="btn btn-sm btn-block btn-primary col-sm-5">切换</a>
                        </div>
                        <div class="col-xs-3">
                            <select name="mode" id="mode" class="form-control select select-sm select-primary col-sm-4" data-toggle="select">
                                <option value="auto">auto</option>
                            </select>
                        </div>
                        <div class="col-xs-3">
                            <a href="javascript:;" id="truncate" class="btn btn-sm btn-block btn-default col-sm-5">清空</a>
                        </div>
                        <div class="col-xs-3">
                            <a href="javascript:;" id="copy" class="btn btn-sm btn-block btn-default col-sm-5">复制结果</a>
                        </div>
                    </div>
                    <textarea name="input" id="outputtext" class="form-control" cols="30" rows="5" placeholder="输出"></textarea>
                    <div id="qrcode"></div>
                </div>
                <textarea id="sandbox" maxlength="100"></textarea>
            </form>
        </div>
        <!-- /.container -->

        <!-- jQuery (necessary for Flat UI's JavaScript plugins) -->
        <script src="js/jquery.min.js"></script>
        <!-- Include all compiled plugins (below), or include individual files as needed -->
        <script src="js/flat-ui.min.js"></script>
        <script src="js/jquery.endecode.js"></script>
        <script src="js/jquery.qrcode.js"></script>
        <script src="js/common.js"></script>
        <script src="js/jsbeautify.js"></script>
        <script src="js/cssbeautify.js"></script>
        <script src="js/popup.js"></script>
    </body>
</html>
